<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"><![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"><![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"><![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
    <head>
        <title>Portfolio | Isatech Indonesia - IT Consulting and Software Development</title>
        <link rel="shortcut icon" href="images/favicon.ico" />
        <!-- CSS -->
        <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
        <link rel="stylesheet" type="text/css" href="css/prettyPhoto.css" />
        <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" />
        <!--[if IE 7]>
        <link rel="stylesheet" type="text/css" href="css/font-awesome-ie7.min.css"/>
        <![endif]-->

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
    <body>
        <!-- start: Top Menu -->
        <div class="navbar navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </a>
                    <a class="brand" href="#"><img src="images/logo.png"/></a>
                    <div class="nav-collapse collapse">
                        <ul class="nav pull-right">
                            <li><a href="./index.html">Home</a></li>
                            <li><a href="./about.html">About</a></li>
                            <li><a href="./services.html">Services</a></li>
                            <li class="active"><a href="./portfolio.html">Portfolio</a></li>
                            <li><a href="./contact.html">Contacts</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- end: Top Menu -->

<!-- start: Container -->
<div class="container">

    <!-- start: Page header / Breadcrumbs -->
    <section class="breadcrumbs">
        <div class="page-header">
            <h1>Portfolio</h1>
        </div>
        <div class="breadcrumbs">
            You are here: <a href="#">Home</a><i class="icon-angle-right "></i>Portfolio
        </div>
    </section>
    <!-- end: Page header / Breadcrumbs -->

    <div class="row">

        <!-- start: Page section -->
        <section id="page-sidebar" class="span12">
            <!-- start: Filter-->
            <div class="row-fluid">
                <div class="span12">
                    <ul id="filtrable" class="clearfix">
                        <li class="current all"><a href="#all">All</a></li>
                        <li class="web"><a href="#web">Web</a></li>
                        <!-- <li class="css"><a href="#css">Mobile</a></li> -->
                        <li class="mobile"><a href="#mobile">Mobile</a></li>
                        <li class="desktop"><a href="#desktop">Desktop</a></li>
                        <li class="other"><a href="#other">Other</a></li>
                    </ul>
                </div>
            </div>
            <!-- end: Filter-->
        </section>
        <!-- end: Page section -->

    </div>

    <!-- start: Portfolio -->
    <section class="row filtrable portfolio thumbnails">
        <article data-id="id-1" data-type="mobile" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest1.jpg" alt="" /><!--  -->
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Edu Social</a></h2>
                    <p>EduSocial adalah suatu add on atau modul social network</p>
                    <a href="./portofolio/edu-social.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-2" data-type="mobile" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest2.jpg" alt="" /><!--  -->
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Kyai Jawab</a></h2>
                    <p>Aplikasi berbasis Android yang digunakan sebagai FAQ seputar agama Islam.</p>
                    <a href="./portofolio/kyai-jawab.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-3" data-type="other desktop" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest3.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">SANTRI Bank BRI</a></h2>
                    <p>Sistem antrian yang membantu dalam mengatur pengantrian pelanggan di Bank BRI.</p>
                    <a href="./portofolio/kyai-jawab.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-4" data-type="web" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest4.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Nueve Hotel</a></h2>
                    <p>Web profile dan aplikasi yang menangani manajemen perhotelan.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-5" data-type="other desktop" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest5.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">SANTRI DPPKAD Bantul</a></h2>
                    <p>Sistem antrian yang membantu dalam mengatur pengantrian pelanggan di DPPKAD Bantul</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-6" data-type="web" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest6.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">GTSSHOP</a></h2>
                    <p>Ecommerce untuk melakukan pelayanan penjualan produk-produk GTS</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>
        <!-- <article data-id="id-7" data-type="php" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest7.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 7</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-8" data-type="css" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest8.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 8</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-9" data-type="html" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest1.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 9</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-10" data-type="css" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest2.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 10</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-11" data-type="html" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest3.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 1</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article>

        <article data-id="id-12" data-type="css" class="span3">
            <div class="thumbnail hover-pf9">
                <img src="example/latest4.jpg" alt="" />
                <div class="mask-1"></div>
                <div class="mask-2"></div>
                <div class="caption">
                    <h2 class="title"><a href="#">Project title 2</a></h2>
                    <p>Per insolens urbanitas pris tantas corpora cum commune dignissim pro delectus salutatus ever labitur.</p>
                    <a href="./portfolio-single.html" class="info btn btn-inverse">Read More</a>
                </div>
            </div>
        </article> -->

    </section>
    <!-- end: Portfolio -->

</div>
<!-- end: Container -->
    <!-- start: Footer -->
    <footer id="footer">
        <div class="container">
            <ul class="social clearfix">
                <li><a href="#" data-original-title="Facebook" data-placement="top" rel="tooltip">
                        <i class="icon-facebook-sign"></i>
                    </a></li>
                <li><a href="#" data-original-title="Twitter" data-placement="top" rel="tooltip">
                        <i class="icon-twitter-sign"></i>
                    </a></li>
                <li><a href="#" data-original-title="Google+" data-placement="top" rel="tooltip">
                        <i class="icon-google-plus-sign"></i>
                    </a></li>
            </ul>
        </div>

    </footer>
    <!-- end: Footer -->

    <!-- start: Footer menu-->
    <section id="footer-menu">
        <div class="container">
            <div class="row">
                <div class="span4">
                    <p class="copyright">&copy; Copyright 2012. Powered by <a href="http://isatechindonesia.com/">Isatech Indonesia</a>.</p>
                </div>
                <div class="span8 hidden-phone">
                    <ul class="pull-right">
                        <li><i class="icon-map-marker"></i> Blimbingsari CT.IV/28A Depok Sleman Yogyakarta 55281</li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
    <!-- end: Footer menu-->
</body>
</html>
